---
title: 层级
icon: Layers
---

## 0 - 画布

此层只包含一个 `canvas` 元素

## 3 - Toast

为什么是 3？因为 Sonner 库默认使用 3 作为 z-index 值

根据 [Wikipedia「Pop-up notification」条目](https://en.wikipedia.org/wiki/Pop-up_notification)中的定义：

> The pop-up notification is a graphical control element that communicates certain events to the user **without forcing them to react to this notification immediately**, unlike conventional pop-up windows. Desktop notifications usually disappear automatically after a short amount of time.

Toast 用于提示不需要打断用户的消息，比如操作的运行结果（无论成功还是失败）等

## 10 - 标题栏

标题栏包括以下元素：

- 菜单栏
- 可拖拽区域
- 窗口控制按钮
- 标签页栏

## 40 - 子窗口（无模式对话框）

子窗口系统在 1.8.0 版本引入，用于构建悬浮在画布上并且可移动和缩放的复杂界面

根据 [Wikipedia「对话框」条目](https://zh.wikipedia.org/wiki/%E5%AF%B9%E8%AF%9D%E6%A1%86)中的定义：

> 这是一种非强制回应的对话框，用于向用户请求非必须资料。即可以不理会这种对话框或不向其提供任何信息而继续当前工作，所以窗口均可打开并处于活动状态或是获得焦点（人机交互热点）。查找／替换对话框可算是无模式对话框。

## 50 - 对话框（有模式对话框）

根据 [Wikipedia「对话框」条目](https://zh.wikipedia.org/wiki/%E5%AF%B9%E8%AF%9D%E6%A1%86)中的定义：

> 这种对话框强制要求用户回应，否则用户不可继续操作，直到与该对话框完成交互。这种对话框设计用于程序运行必须停下来，直到从用户获得额外信息，然后才可继续操作，或可能只想确认用户想要执行有潜在危险的操作。有模式对话框以用户不喜欢看到方式出现，或是被习惯不去注意对话框提示的用户忽略，导致无法避免危险操作，故此一般视为坏的设计方案。

所以对话框需要覆盖整个窗口

## 50 - 交互组件

Select 组件的弹出窗口
